<!--
 * @Author: LBH 1336709799@qq.com
 * @Date: 2024-11-07 15:57:05
 * @LastEditors: LBH 1336709799@qq.com
 * @LastEditTime: 2024-11-07 22:11:53
 * @FilePath: \03-XiaoMi\index.html
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./css/base.css">
    <link rel="stylesheet" href="./css/common.css">
    <link rel="stylesheet" href="./css/index.css">
</head>
<body>
    <!-- 顶部 -->
    <div class="shortcut wrapper">
        <ul>
            <li><a href="#">小米网</a></li>
          
            <li><a href="#">MIUI</a></li>
          
            <li><a href="#">米聊</a></li>
          
            <li><a href="#">游戏</a></li>
          
            <li><a href="#">多看阅读</a></li>
          
            <li><a href="#">云服务</a></li>

            <li><a href="#">小米网移动版</a></li>

            <li><a href="#">问题反馈</a></li>

            <li><a href="#">Select Region</a></li>
          
        </ul>
    </div>
    <!-- 头部 -->
     <div class="header wrapper">
        <img src="./images/logo.png" alt="">
        <span><img src="./images/new.gif" alt=""></span>
        <ul>
            <li><a href="#">小米手机</a></li>
          
            <li><a href="#">红米</a></li>
          
            <li><a href="#">平板</a></li>
          
            <li><a href="#">电视</a></li>
          
            <li><a href="#">盒子</a></li>
          
            <li><a href="#">影音</a></li>

            <li><a href="#">路由器</a></li>

            <li><a href="#">智能硬件</a></li>

            <li><a href="#">服务</a></li>

            <li><a href="#">社区</a></li>      
        </ul>
     </div>
    <!-- 身体 -->
     <div class="banner wrapper">
        <img src="./images/banner.png" alt="">
        <div class="subnav">
            <ul>
              <li>
                <div><a href="#" class="classify">手机</a><a href="#">平板</a><a href="#">电话卡</a></div>
          
                <span><img src="./images/right.png" alt=""></span>
          
              </li>
          
              <li>
                <div><a href="#" class="classify">电视</a><a href="#">盒子</a></div>
          
                <span><img src="./images/right.png" alt=""></span>
          
              </li>
          
              <li>
                <div><a href="#" class="classify">路由器</a><a href="#">智能硬件</a></div>
          
                <span><img src="./images/right.png" alt=""></span>
          
              </li>
          
              <li>
                <div><a href="#" class="classify">移动电源</a><a href="#">插线板</a></div>
          
                <span><img src="./images/right.png" alt=""></span>
          
              </li>
          
              <li>
                <div><a href="#" class="classify">耳机</a><a href="#">音箱</a></div>
          
                <span><img src="./images/right.png" alt=""></span>
          
              </li>
          
              <li>
                <div><a href="#" class="classify">电池</a><a href="#">存储卡</a></div>
          
                <span><img src="./images/right.png" alt=""></span>
          
              </li>
          
              <li>
                <div><a href="#" class="classify">保护套</a><a href="#">后盖</a></div>
          
                <span><img src="./images/right.png" alt=""></span>
          
              </li>
          
              <li>
                <div><a href="#" class="classify">贴膜</a><a href="#">其他配件</a></div>
          
                <span><img src="./images/right.png" alt=""></span>
          
              </li>
          
              <li>
                <div><a href="#" class="classify">米兔</a><a href="#">服装</a></div>
          
                <span><img src="./images/right.png" alt=""></span>
          
              </li>
          
              <li>
                <div><a href="#" class="classify">箱包</a><a href="#">其他周边</a></div>
          
                <span><img src="./images/right.png" alt=""></span>
          
              </li>
          
              
            </ul>
          
          </div>
     </div>
    <!-- 商品活动 -->
     <div class="price wrapper">
        <div class="empty">我就是一个空色块 <br/>一言不合就这么任性</div>
        <img src="./images/pro1.png" alt="">
        <img src="./images/pro2.png" alt="">
        <div class="lp"><img src="./images/pro3.png" alt=""></div>
     </div>
     <!-- 智能硬件 -->
    <div class="wrapper1">
        <div class="tech wrapper">
            <!-- 标题 -->
            <div class="title">
                <h3>智能硬件</h3>
                <p>查看全部</p>
            </div>
            <!-- 内容 -->
            <div class="content">
                <div class="left">
                    <a href="#"><img src="./images/girl.jpg" alt=""></a>          
                </div>
                <div class="right">
                    <ul>
                        <li>
                            <a href="#">
                                <div class="pic"><img src="./images//d1.jpg" alt=""></div>
                          
                                <div class="txt">
                                  <div class="info">
                                    <h4>小米路由器3</h4>
                          
                                    <p>四天线设计，更安全更稳定</p>
                                              
                                  </div>
                          
                                  <p class="price">149元</p>
                          
                                </div>        
                              </a>
                              <div class="cover">
                                    免邮费                     
                              </div>
                        </li>
                        <li>
                            <a href="#">
                                <div class="pic"><img src="./images//d2.jpg" alt=""></div>
                          
                                <div class="txt">
                                  <div class="info">
                                    <h4>米家 LED 智能台灯</h4>
                          
                                    <p>无可视频闪，亮度色温无级调节</p>
                                              
                                  </div>
                          
                                  <p class="price">169元</p>
                          
                                </div>        
                              </a>
                        </li>
                        <li>
                            <a href="#">
                                <div class="pic"><img src="./images//d3.jpg" alt=""></div>
                          
                                <div class="txt">
                                  <div class="info">
                                    <h4>小米净水器 厨下式</h4>
                          
                                    <p>RO反渗透直出纯净水,包邮包安装</p>
                                              
                                  </div>
                          
                                  <p class="price">1999元</p>
                          
                                </div>        
                              </a>
                              <div class="cover">
                                免邮费                     
                          </div>
                        </li>
                        <li class="sp">
                            <a href="#">
                                <div class="pic"><img src="./images//d4.jpg" alt=""></div>
                          
                                <div class="txt">
                                  <div class="info">
                                    <h4>小蚁智能摄像机 夜视版</h4>
                          
                                    <p>能看能听能说，手机远程观看</p>
                                              
                                  </div>
                          
                                  <p class="price">149元</p>
                          
                                </div>        
                              </a>
                        </li>
                        <li>
                            <a href="#">
                                <div class="pic"><img src="./images//d5.jpg" alt=""></div>
                          
                                <div class="txt">
                                  <div class="info">
                                    <h4>Yeelight床头灯</h4>
                          
                                    <p>触摸式操作,给卧室1600万种颜色</p>
                                              
                                  </div>
                          
                                  <p class="price">249元</p>
                          
                                </div>        
                              </a>
                        </li>
                        <li>
                            <a href="#">
                                <div class="pic"><img src="./images//d6.jpg" alt=""></div>
                          
                                <div class="txt">
                                  <div class="info">
                                    <h4>小米空气净化器2</h4>
                          
                                    <p>10分钟,房间空气焕然一新</p>
                                              
                                  </div>
                          
                                  <p class="price">699元</p>
                          
                                </div>        
                              </a>
                        </li>
                        <li>
                            <a href="#">
                                <div class="pic"><img src="./images//d7.jpg" alt=""></div>
                          
                                <div class="txt">
                                  <div class="info">
                                    <h4>小米智能安防套装</h4>
                          
                                    <p>智能警戒，为您的家增添一份安心</p>
                                              
                                  </div>
                          
                                  <p class="price1">169元<span class="origin">188元</span></p>
                          
                                </div>        
                              </a>
                              <div class="cover1">享9折</div>
                        </li>
                        <li class="sp" >
                            <a href="#">
                                <div class="pic"><img src="./images//d8.jpg" alt=""></div>
                          
                                <div class="txt">
                                  <div class="info">
                                    <h4>米家iHealth血压计</h4>
                          
                                    <p>爸妈上手就会用的智能血压计</p>
                                              
                                  </div>
                          
                                  <p class="price">399元</p>
                          
                                </div>        
                              </a>
                        </li>
                    </ul>
                </div>
            </div>
         </div>
    </div>
    <!-- 帮助 -->
     <div class="help wrapper">
        <div class="left">
            <dl>
                <dt>帮助中心</dt>
            
                <dd><a href="#">账户管理</a></dd>
            
                <dd><a href="#">购物指南</a></dd>
            
                <dd><a href="#">订单操作</a></dd>
            
              </dl>
            
              <dl>
                <dt>服务支持</dt>
            
                <dd><a href="#">售后政策</a></dd>
            
                <dd><a href="#">自助服务</a></dd>
            
                <dd><a href="#">相关下载</a></dd>
            
              </dl>
            
              <dl>
                <dt>线下门店</dt>
            
                <dd><a href="#">小米之家</a></dd>
            
                <dd><a href="#">服务网点</a></dd>
            
                <dd><a href="#">零售网点</a></dd>
            
              </dl>
            
              <dl>
                <dt>关于小米</dt>
            
                <dd><a href="#">了解小米</a></dd>
            
                <dd><a href="#">加入小米</a></dd>
            
                <dd><a href="#">联系我们</a></dd>
            
              </dl>
            
              <dl>
                <dt>关注我们</dt>
            
                <dd><a href="#">新浪微博</a></dd>
            
                <dd><a href="#">小米部落</a></dd>
            
                <dd><a href="#">官方微信</a></dd>
            
              </dl>

        </div>
        <div class="right">
            <h2>400-100-5678</h2>
            <p>周一至周日 8:00-18:00 </p>
            <p>（仅收市话费）</p>
        </div>
            
          
    </div>
    <!-- 版权 -->
    <div class="wrapper2">
        <div class="copyright wrapper">
            <img src="./images/logo.png" alt="">
            <p>
                <a href="#">小米网</a>|
                <a href="#">MIUI</a>|
                <a href="#">米聊</a>|
                <a href="#">多看书城</a>|
                <a href="#">小米路由器</a>|
                <a href="#">视频电话</a>|
                <a href="#">小米后院</a>|
                <a href="#">小米天猫店</a>|
                <a href="#">小米淘宝直营店</a>|   
                <a href="#">小米网盟</a>|   
                <a href="#">问题反馈</a>|   
                <a href="#">Select Region</a><br/>
                <a href="#">©mi.com 京ICP证110507号 京ICP备10046444号 京公网安备11010802020134号 京网文[2014]0059-0009号 
                    违法和不良信息举报电话:185-0130-1238,本网站所列数据,除特殊说明,所有数据均出自我司实验室测试</a>              
            </p>
            
        </div>
    </div>        
</body>
</html>